<template>
    <portlet name="查询记录汇总">
        <div class="search_header">
            <i-form :model="formItem" :label-width="80">
                <Row>
                    <i-col span='5'>
                        <Form-item label="产品名称">
                            <i-select :model.sync="formItem.productCode" placeholder="选择产品">
                                <i-option value="PRO_IDENTITYCARDONLY">身份唯一识别码多项信息</i-option>
                                <i-option value="PRO_IND_AUTH_TWO_NOPIC">个人认证二要素(无照)</i-option>
                                <i-option value="PRO_BADINFORM">自然人不良信息查询</i-option>
                                <i-option value="PRO_QYZXBG">企业征信报告</i-option>
                                <i-option value="PRO_ECIEXCEPTION">企业工商数据查询-权威版</i-option>
                                <i-option value="PRO_AUTH_THREE">个人认证三要素</i-option>
                                <i-option value="PRO_personIdCard">个人身份证照片查询</i-option>
                                <i-option value="PRO_PERSONALINVESTMENT">个人对外投资查询</i-option>
                                <i-option value="PRO_USERAUTH">认证个人身份证并显示照片(新)</i-option>
                                <i-option value="PRO_SIMPLECHECK">认证个人身份证并显示照片</i-option> 
                                <i-option value="PRO_QUERYCREDIT">查询公积金</i-option>
                            </i-select>
                        </Form-item>
                    </i-col>
                    <i-col span='11'>
                        <Form-item label="交易时间">
                            <Row>
                                <i-col span="11">
                                    <Date-picker @on-change='changeStartDate' type="date" placeholder="开始日期" :value.sync="formItem.startDate"></Date-picker>
                                </i-col>
                                <i-col span="2" style="text-align: center">-</i-col>
                                <i-col span="11">
                                    <Date-picker @on-change='changeEndDate' type="date" placeholder="结束时间" :value.sync="formItem.endDate"></Date-picker>
                                </i-col>
                            </Row>
                        </Form-item>
                    </i-col>
                    <i-col span='6'>
                        <Form-item :label-width='10'>
                            <i-button @click='searchData' type="primary">查询</i-button>
                            <i-button @click='searchData' type="primary">EXCEL导出</i-button>
                        </Form-item>
                    </i-col>
                </Row>
            </i-form>
        </div>
        <div class="search_content">
            <i-table :columns="columns1" :data="data1"></i-table>
        </div>
    </portlet>
</template>
<script>
    import Portlet from '../../components/portlet.vue';
    export default {
        components:{ Portlet },
        data () {
            return {
                formItem: {
                    productCode:'',
                    startDate: '',
                    endDate: '',
                },
                day:{
                    startDateD:'',
                    endDateD:''
                },
                columns1: [
                    {
                        title: '产品名称',
                        key: 'companyName',
                        width:110,
                    },
                    {
                        title: '产品编码',
                        key: 'companyCode',
                        width:120,
                    },
                    {
                        title: '成功条数',
                        key: 'success_count',
                    },
                    {
                        title: '失败条数',
                        key: 'failed_count',
                    },
                    {
                        title: '总条数',
                        key: 'all_count',
                    },
                    {
                        title: '总金额',
                        key: 'money',
                    }
                ],
                data1: [
                ]
            }
        },
        computed:{

        },
        methods: {
            changePage(a){
                this.pageInfor.page=a;
                this.getData();
            },
            changeStartDate(a){
                this.day.startDateD=a.toString();
            },
            changeEndDate(a){
                this.day.endDateD=a.toString();
            },
            searchData(){
                this.getData();
            },
            getData(){
                this.$http.jsonp(this.path+'consump/consumpServlet/transStatisticsList',{
                    params:{
                            endDate:this.day.endDateD,
                            startDate:this.day.startDateD,
                            productCode:this.formItem.productCode,},
                    jsonp:'callback'
                }).then(
                    (datas)=>{
                        if(datas.body.code=='001'){
                            this.data1=datas.body.result;
                        }else if(datas.body.code=='002'){
                            this.$Message.success('提交信息出错p!');
                        }else if(datas.body.code=='997'||datas.body.code=='998'){
                            this.store.state.user.companyId=null;
                            this.store.state.user.companyName=null;
                            this.store.state.allInfor=null;
                            this.$Message.error('登陆超时或未登陆,请登陆!');
                            this.myRouter.go({path:'/login'});
                        }
                    },
                    (error)=>{
                        this.$Message.error('网络出现问题!');
                    }   
                );
            }
        },

        ready(){
            this.$nextTick(()=>{
                this.getData();
         })
        }
    }
</script>
<style scoped lang="less" rel="stylesheet/scss">
    @import '../../styles/query.scss';
</style>